<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="GBK"%>
<%@ include file="/common/taglibs.jsp"%>
 <script type="text/javascript">
    //<![CDATA[
        $(document).ready(function () {
            var mydata = [
                    {id:"1", invdate:"2007-10-01",name:"test",  note:"note",  amount:"200.00",tax:"10.00",closed:true, ship_via:"TN",total:"210.00"},
                    {id:"2", invdate:"2007-10-02",name:"test2", note:"note2", amount:"300.00",tax:"20.00",closed:false,ship_via:"FE",total:"320.00"},
                    {id:"3", invdate:"2007-09-01",name:"test3", note:"note3", amount:"400.00",tax:"30.00",closed:false,ship_via:"FE",total:"430.00"},
                    {id:"4", invdate:"2007-10-04",name:"test4", note:"note4", amount:"200.00",tax:"10.00",closed:true ,ship_via:"TN",total:"210.00"},
                    {id:"5", invdate:"2007-10-31",name:"test5", note:"note5", amount:"300.00",tax:"20.00",closed:false,ship_via:"FE",total:"320.00"},
                    {id:"6", invdate:"2007-09-06",name:"test6", note:"note6", amount:"400.00",tax:"30.00",closed:false,ship_via:"FE",total:"430.00"},
                    {id:"7", invdate:"2007-10-04",name:"test7", note:"note7", amount:"200.00",tax:"10.00",closed:true ,ship_via:"TN",total:"210.00"},
                    {id:"8", invdate:"2007-10-03",name:"test8", note:"note8", amount:"300.00",tax:"20.00",closed:false,ship_via:"FE",total:"320.00"},
                    {id:"9", invdate:"2007-09-01",name:"test9", note:"note9", amount:"400.00",tax:"30.00",closed:false,ship_via:"TN",total:"430.00"},
                    {id:"10",invdate:"2007-09-08",name:"test10",note:"note10",amount:"500.00",tax:"30.00",closed:true ,ship_via:"TN",total:"530.00"},
                    {id:"11",invdate:"2007-09-08",name:"test11",note:"note11",amount:"500.00",tax:"30.00",closed:false,ship_via:"FE",total:"530.00"},
                    {id:"12",invdate:"2007-09-10",name:"test12",note:"note12",amount:"500.00",tax:"30.00",closed:false,ship_via:"FE",total:"530.00"}
                ],
                grid = $("#list"), lastSel = -1, editingRowId = -1;

            grid.jqGrid({
                datatype:'local',
                data: mydata,
                colNames:['Inv No','Date','Client','Amount','Tax','Total','Closed','Shipped via','Notes'],
                colModel:[
                    {name:'id',index:'id',width:70,align:'center',sorttype:'int',hidden:true},
                    {name:'invdate',index:'invdate',width:80,align:'center',sorttype:'date',
                     formatter:'date',formatoptions: {newformat:'m/d/Y'},datefmt:'m/d/Y'},
                    {name:'name',index:'name',width:70,editable:true,classes:autoCompleteFieldClassName},
                    {name:'amount',index:'amount',width:70,formatter:'number',align:'right',
                     editrules:{required:true,number:true},editable:true},
                    {name:'tax',index:'tax',width:50,formatter:'number',align:'right',editable:true,
                     editrules:{required:true,number:true}},
                    {name:'total',index:'total',width:60, formatter:'number',align:'right',
                     editrules:{required:true,number:true},editable:true},
                    {name:'closed',index:'closed',width:60,align:'center',editable:true,
                     formatter:'checkbox',edittype:'checkbox',editoptions:{value:'Yes:No',defaultValue:'Yes'}},
                    {name:'ship_via',index:'ship_via',width:90,align:'center',formatter:'select',editable:true,
                     edittype:'select',editoptions:{value:'FE:FedEx;TN:TNT;IN:Intim',defaultValue:'Intime'}},
                    {name:'note',index:'note',width:70,sortable:false,editable:true}
                ],
                rowNum:10,
                rowList:[5,10,20],
                pager: '#pager',
                gridview:true,
                rownumbers:true,
                sortname: 'invdate',
                viewrecords: true,
                sortorder: 'desc',
                caption:'Just simple local grid',
                height: '100%',
                editurl: 'clientArray',
                onSelectRow: function(rowid) {
                    if (rowid && rowid !== lastSel) {
                        grid.jqGrid('restoreRow',lastSel);
                        lastSel = rowid;
                    }
                },
                ondblClickRow: function(rowid) {
                    editingRowId = rowid;
                    grid.jqGrid('editRow',rowid,true,null, null, null, {},function(){
                        setTimeout(function(){
                            grid.focus();
                        },100);
                    });
                    return;
                }
            });
            grid.jqGrid('gridResize', { minWidth: 450, minHeight: 150 });
            grid.jqGrid('bindKeys', {
                onEnter: function(rowid) {
                    //alert("You enter a row with id: " + rowid);
                    editingRowId = rowid;
                    // we use aftersavefunc to restore focus
                    grid.jqGrid('editRow',rowid,true,null, null, null, {},function(){
                        setTimeout(function(){
                            grid.focus();
                        },100);
                    });
                }
            });
            grid.jqGrid('setSelection',"1");
            grid.focus();

            var originalCheckValues = $.jgrid.checkValues,
                originalHideModal = $.jgrid.hideModal,
                error_td_input_selector;
            $.jgrid.checkValues = function(val, valref,g, customobject, nam) {
                var tr,td,
                    ret = originalCheckValues.call(this,val, valref,g, customobject, nam);
                if (!ret[0]) {
                    tr = $("tr#"+editingRowId);
                    tr.children("td:nth-child("+(valref+1)+")");
                    tr.find("td input").removeClass("ui-state-error");
                    error_td_input_selector = "tr#"+editingRowId+" > td:nth-child("+(valref+1)+") > input:first";
                    td = tr.children("td:nth-child("+(valref+1)+")");
                    td.find("input").addClass("ui-state-error");
                }
                return ret;
            };
            $.jgrid.hideModal = function (selector,o) {
                var input, oldOnClose;
                if (error_td_input_selector) {
                    input = $(error_td_input_selector);
                    if (input.length > 0) {
                        oldOnClose = o.onClose;
                        o.onClose = function(s) {
                            if ($.isFunction(oldOnClose)) {
                                oldOnClose.call(s);
                            }
                            setTimeout(function(){
                                input.focus();
                            },100);
                        };
                    }
                }
                originalHideModal.call(this,selector,o);
            };
            
    		$("#user").combogrid({
    			url : '${ctx}/utils/comboUserGrid',
    			/* debug : true,
    			searchButton : false,
    			resetButton : false,
    			searchIcon:true,
    			okIcon:true,
    			draggable:true,
    			rememberDrag: true,
    			showOn:false, */
    			replaceNull: true,
    			colModel : [ {
    				'columnName' : 'id',
    				'width' : '10',
    				'label' : 'id'
    			}, {
    				'columnName' : 'username',
    				'width' : '60',
    				'label' : 'username'
    			}, {
    				'columnName' : 'realname',
    				'width' : '30',
    				'label' : 'realname'
    			} ],
    			select : function(event, ui) {
    				$("#user-id").val(ui.item.id);
    				$("#user").val(ui.item.username);
    				return false;
    			}
    		});
        });
    //]]>
    </script>




 <table id="list"><tr><td/></tr></table>
    <div id="pager"></div>
